<style>
    .tab a{border-bottom: none;border-radius: 0;}
    .package-box-detail{width: 1000px;border:1px solid #ccc;padding: 20px}
    .doctor-item{width: 80px;height: 35px;text-align: center;float: left;line-height: 35px;margin-right: 10px;position: relative;background: #d0d0d0;}
    .doctor-item span{position: absolute;right:-8px;top:-19px;font-size: 26px;cursor: pointer}
    .firstStep input ,.secondStep input{height: 33px;padding-left: 10px}
    .upload-box{padding-top:50px}
    .row{margin-bottom: 20px;}
    textarea{width: 100%;height: 80px}
    input[type="file"] {  position: absolute;  top: 50px;  opacity: 0;  width: 100px;  height: 35px;  left: 15px;  }
    .search-box {
        width: 363px;
        margin: 0 auto;
        position: relative;
    }
    .search-box label {
        border: 1px solid #ccc;
        border-radius: 4px;
        padding: 8px 10px;
        font-size: 14px;
        width: 100%;
        color: #000;
    }
    .search-box label .search-ico {
        background-image: url(./img/icon_search_blue.png);
        display: inline-block;
        vertical-align: middle;
        width: 16px;
        height: 16px;
    }
    .search-box label input {
        border: none;
        -webkit-appearance: none;
        vertical-align: middle;
        padding: 0 0 0 5px;
        display: inline-block;
        width: 90%;
        outline: none;
        font-weight: normal;
    }
    .search-box .author-list {
        position: absolute;
        background: #fff;
        left: 0;
        top: 39px;
        z-index: 2;
        width: 100%;
        border: 1px solid #e9e9e9;
        max-height: 190px;
        overflow: auto;
        display: none;
    }
    .search-box .author-list .author-item {
        cursor: pointer;
        margin: 0;
        padding: 4px 10px;
    }
    .search-box .author-list .author-item:hover,
    .search-box .author-list .author-item.active {
        background: #DAF0FF;
    }
    .choice-list {
        margin: 15px 10px;
        min-height: 90px;
    }
    .choice-list .choice-item {
        border: 1px solid #ccc;
        display: inline-block;
        padding: 5px 8px;
        border-radius: 5px;
        margin: 4px;
        position: relative;
    }
    .choice-list .choice-item .del {
        position: absolute;
        top: -11px;
        right: -9px;
        font-size: 18px;
        background: #cecece;
        width: 18px;
        line-height: 18px;
        text-align: center;
        border-radius: 50%;
        color: #f0f0f0;
        cursor: pointer;
        display: none;
    }
    .choice-list .choice-item:hover .del {
        display: block;
    }
    .choice-list .choice-item.animate {
        animation: myscale .2s;
    }
</style>
<section class="content">
   <div class="tab">
       <a href='javascript:;' class="btn btn-primary btn-lg" role="button">套餐详情</a>
       <a ui-sref="package/packageRelation({wxGoodsId:{{wxGoodsId}}})" class="btn btn-default btn-lg" role="button">关联服务</a>
       <a ui-sref="package/packageAgreement({wxGoodsId:{{wxGoodsId}}})" class="btn btn-default btn-lg" role="button">内容协议</a>
       <a ui-sref="package/packageList" class="btn btn-primary pull-right">返回上级</a>
   </div>
    <div class=" package-box-detail">
        <div class="row">
            <div class="col-xs-2">标题</div>
            <div class="col-xs-10"><input type="text" class="form-control" value="{{goodsDetailModel.name}}" ng-model="goodsDetailModel.name"/></div>
        </div>
        <div class="row">
            <div class="col-xs-2">充值：</div>
            <div class="col-xs-3"><input type="text" class="form-control" value="{{goodsDetailModel.rechargePrice}}" ng-model="goodsDetailModel.rechargePrice"></div>
            <div class="col-xs-2">有效期：</div>
            <div class="col-xs-4">
                <div class="col-xs-6"><input type="text" class="form-control" ng-model="goodsDetailModel.liveTime"></div>
                <div class="col-xs-6">
                    <select name="timeType" class="form-control">
                        <option value="1">年</option>
                        <option value="2" selected>月</option>
                        <option value="3">无限期</option>
                    </select>
                </div>


            </div>
        </div>
        <div class="row">
            <div class="col-xs-2">原价：</div>
            <div class="col-xs-10"><input type="text" class="form-control" value="{{goodsDetailModel.price}}" ng-model="goodsDetailModel.price"></div>
        </div>
        <div class="row">
            <div class="col-xs-2">支付类别：</div>
            <div class="col-xs-2">
                <select name="payType" class="form-control">
                    <option value="1">一阶段</option>
                    <option value="2">二阶段</option>
                </select>
            </div>
        </div>
        <div class="row">
            <div class="col-xs-2">显示余额：</div>
            <div class="col-xs-2">
                <select name="showBalance" class="form-control">
                    <option value="0">不显示</option>
                    <option value="1">显示</option>
                </select>
            </div>
        </div>

        <div class="row">
            <div class="col-xs-4 firstStep">
                <span>售价：</span>
                <input type="text" ng-model="goodsDetailModel.actualPrice" value="{{goodsDetailModel.actualPrice}}">
            </div>
            <div class="col-xs-4 secondStep">
                <span>定金：</span>
                <input type="text" value="{{goodsDetailModel.earnestMoney}}" ng-model="goodsDetailModel.earnestMoney">
            </div>
            <div class="col-xs-4 secondStep">
                <span>尾款：</span>
                <input type="text" value="{{goodsDetailModel.finalMoney}}" ng-model="goodsDetailModel.finalMoney">
            </div>
        </div>
        <div class="row">
            <div class="col-xs-2">医生归属：</div>
            <div class="col-xs-8" id="doctorList">
               <div class="doctor-item" ng-repeat="n in goodsDetailModel.doctorList" data-doctorId="{{n.doctorRowId}}">
                   <span ng-click="delDoc($event)">&times;</span>
                   {{n.userName}}
               </div>
            </div>
            <div class="col-xs-1">
                <button class="btn btn-primary" data-toggle="modal" data-target="#choiceDoctorModal">选择医生</button>
            </div>
        </div>
        <div class="row">
            <div class="col-xs-2">封面：</div>
            <div class="col-xs-3">
                <img src="{{basePictureUrl+goodsDetailModel.coverUrl }}" class="imgCover" alt="" onerror="(this.src='./img/img-cover.png')" width="200px" height="150px">
            </div>
            <div class="col-xs-5 upload-box">
                <a href="javascript:;" class="btn btn-primary btn" role="button">上传封面图
                    　<input type="file" onchange="angular.element(this).scope().uploadImg(this,'img')">
                </a>
            </div>
        </div>
        <div class="row">
            <div class="col-xs-2">社群图片：</div>
            <div class="col-xs-3">
                <img src="{{basePictureUrl+goodsDetailModel.communityPicture}}" class="communityPicture" alt="" onerror="(this.src='./img/img-cover.png')" width="200px" height="150px">
            </div>
            <div class="col-xs-5 upload-box">
                <a href="javascript:;" class="btn btn-primary btn" role="button">上传图片
                    　<input type="file" onchange="angular.element(this).scope().uploadGroupImg(this,'img')">
                </a>
            </div>
        </div>
        <div class="row">
            <div class="col-xs-2">内容：</div>
            <div class="col-xs-10">
                <div class="edit" edit></div>
            </div>
        </div>
        <div class="row">
            <div class="col-xs-12 text-center">
                <a href="javascript:;" class="btn btn-primary btn-lg" ng-click="commit()">保存</a>
            </div>
        </div>
    </div>
    <div class="modal fade ng-scope in" id="choiceDoctorModal">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                    <h4 class="modal-title">添加项目成员</h4>
                </div>
                <div class="modal-body">
                    <div class="search-box">
                        <label>
                            <i class="search-ico"></i>
                            <input type="text" placeholder="输入姓名搜索" id="searchDoctor">
                        </label>
                        <div class="author-list"></div>
                    </div>
                    <div class="choice-list">
                        <p class="choice-item" ng-repeat="n in goodsDetailModel.doctorList" data-doctorId="{{n.doctorRowId}}">
                            <span>{{n.userName}}</span>
                            <i class="del">×</i>
                        </p>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-raised btn-default cancel" data-dismiss="modal">取 消</button>
                    <button type="button" class="btn btn-raised btn-info" id="setMembersBtn">确 定</button>
                </div>
            </div>
        </div>
    </div>
</section>